<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>青年公寓项目 - 登录页面</title>
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/index.css">
</head>
	<body>
		<div class="login">
		<img src="${pageContext.request.contextPath}/image/logo.png" alt="智游">
		<p>青年公寓系统</p>
		<form action="${pageContext.request.contextPath}/user/login" method="post"  onsubmit="return submitForm()">
		<div>
			<input type="text" id="username" name="name" value="" placeholder="请输入用户名" onblur="checkName()">
		</div>
		<p style="margin:0;" class="error-message" id="errorMes"></p>
		<div>
			<input type="password" id="password" name="pass" value="" placeholder="请输入密码">
		</div>
		<div>
			<p class="error-message">${error}</p>
			<input type="submit" value="登录">
		</div>
		</form>
	</div>
	<script>
		if (window.top !== window) {
			window.top.location.reload();
		}
		
		
		function checkName(){
			var name = document.getElementById("username").value
			var flag = new RegExp("[`·~!@#$^&*()=|{}':;',\\[\\].<>《》/?~！@#￥……&*（）——|{}【】‘；：”“'。，、？ ]")
			var error = document.getElementById("errorMes")
			if(/.*[\u4e00-\u9fa5]+.*$/.test(name)){
				error.innerText = "不能含有汉字"
			}else if(flag.test(name)){
				error.innerText = '包含非法字符'
			}else{
				error.innerText = ""
				return true;
			}
			return false;
		}
		function submitForm(){
			var password = document.getElementById("password").value
			 if(!checkName()){
				alert("请填写正确的用户名！") 
				return false;
			}else if(password == null || password == ""){
				alert("请填输入密码！") 
				return false;
			}else{
				return true;
			}
		}
	</script>
</body>
</html>